<?xml version="1.0"?>

<f:view xmlns="http://www.w3.org/1999/xhtml"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui"
	xmlns:ui="http://java.sun.com/jsf/facelets">
	<h:head />
	<h:body>
	
	<h3>Khalil test</h3>
	<h:form> 
	<h:inputText id="number1" value="#{sliderView.number1}" />
 	<p:slider for="number1">
		<p:ajax event="slideEnd" listener="#{sliderView.onSlideEnd}" update="dispo" />
 	</p:slider>
 	<h:inputText id="dispo" value="#{sliderView.dispo}" style="width: 200px" />
	</h:form>
	
	<h3 style="margin-top: 0">VVM</h3>
    <h:panelGrid columns="1" style="margin-bottom: 10px">
        <h:outputText id="output1" value="TextOutput#{sliderView.number1}" />
        <h:inputHidden id="txt1" value="#{sliderView.number1}" />
        <p:slider for="txt1" display="output1" style="width: 200px" displayTemplate="{value}" />
    </h:panelGrid>
    
    <h3>TAILLE</h3>
    <h:panelGrid columns="1" style="margin-bottom: 10px">
        <h:outputText id="output" value="Set ratio to %#{sliderView.number2}" />
        <h:inputHidden id="txt2" value="#{sliderView.number2}" />
        <p:slider for="txt2" display="output" style="width: 200px" displayTemplate="Set ratio to %{value}" />
    </h:panelGrid>
    
    <h3>DISPONIBILTE</h3>
    <h:panelGrid columns="1" style="margin-bottom: 10px">
        <h:outputText id="output3" value="Set ratio to %#{sliderView.dispo}" />
        <h:inputHidden id="txt3" value="#{sliderView.dispo}" />
        <p:slider for="txt3" step="50" display="output3" style="width: 200px" displayTemplate="Set ratio to %{value}" />
    </h:panelGrid>
    
    <h3>BANDE PASSANTE</h3>
    <h:panelGrid columns="1" style="margin-bottom: 10px">
        <h:outputText id="output4" value="Set ratio to %#{sliderView.number4}" />
        <h:inputHidden id="txt4" value="#{sliderView.number4}" />
        <p:slider for="txt4" step="25" display="output4" style="width: 200px" displayTemplate="Set ratio to %{value}" />
    </h:panelGrid>
    
    <h3>STOCKAGE</h3>
    <h:panelGrid columns="1" style="margin-bottom: 10px">
        <h:outputText id="output5" value="Set ratio to %#{sliderView.number5}" />
        <h:inputHidden id="txt5" value="#{sliderView.number5}" />
        <p:slider for="txt5" step="4" display="output5" style="width: 200px" displayTemplate="Set ratio to %{value}" />
    </h:panelGrid>
		
	</h:body>
</f:view>